import React from 'react'
// ===================================================================== Temp
import SubmitForm from '#cpt/temp/SubmitForm'
// ===================================================================== global declare
const { $fn, $Lazy, $http } = window
// ===================================================================== Lazy
const $cache 		= $Lazy.file(()=>import('#private/cache-api'))
const Button 		= $Lazy.load(()=>import('@antd/button'))
const BarcodeForm 	=  $Lazy.state(()=>import('./barcode-form'))
// ===================================================================== Lazy
const width = 300
// ===================================================================== component
class Index extends React.Component{
	state = {
		data:{},
		formData : [
			{ label: '当前条码号',	name: 'spec_code', 		width, readOnly:true,  mb:0	},
			{ label: '生成数量',		name: 'create_num',		width, type:'number', mb:0, value:1, onValue:({ value, ref }) =>{
				if(value < 1) setTimeout(()=> ref.setValue({ create_num: 1}) )
			}},
			{ label: '医院名称',		name: 'hospital_id',	width, type:'select', mb:0, loading:true, onValue:({ rows }) => {
				this.submit.hosp_name = rows ? rows.name : ''
			}},
		]
	}
	submit = { hosp_name:'' }
	
	componentDidMount(){ this.getSelect() }
	
	// 获取下拉数据
	getSelect = () => {
		const { formData } = this.state
		$cache.then( async f => {
			// 医院
			$fn.setRow( formData, 'hospital_id', await f.getCache({ api:'hospital' }) )
			// 
			this.setState({ formData })
		})
	}
	
	fetch = () => $http.submit(this,'barcode/info').then(({ spec_code })=> this.formRef.setValue({ spec_code }) )
	
	render(){
		const { submitLoading, data } = this.state
		return (
			<>
				{/* 搜索 */}
				<div className='bcf p10'>
					<div className='bor1' style={{padding:'10px 10px 5px 10px'}}>
						<div className='fx'>
							<div className='mr20 pb10'>
								{
									SubmitForm.call(this,{
										labelWidth	: 's6',
										api			: 'sp-barcode-log/add',
										query		: ({ create_num, hospital_id }) => ( { create_num, hospital_id } ),
										onForm		: this.fetch,
										onRefresh	: ({ data, param}) => {
											this.fetch()
											this.setState({ data })
											this.codeformRef.fetch()
										}
									})
								}
							</div>
							<Button label='生成条码' loading={submitLoading} size='middle' code='F1' onClick={()=>this.formRef.submit()} />
						</div>
						<div className='tbor1 lh26 pt5'>
							<div><span className='g6 mr10'>开始条码:</span> <b>{ $fn.val(data.firstId) }</b></div>
							<div><span className='g6 mr10'>结束条码:</span> <b>{ $fn.val(data.last_code) }</b></div>
						</div>
					</div>
				</div>
				{/* 搜索表单 表格 */}
				<div className='bcf mt5 fv ex'>
					<BarcodeForm onRef={ ref => this.codeformRef = ref } />
				</div>
			</>
		)
	}
}

export default Index